<template>
  <div>
    <h3>积分配置</h3>
    <div class="itemCls">
      <div class="lab">捐赠兑换比例：</div>
      <div>
        <el-input style="width:200px" v-model="form.donation_exchange_ratio" placeholder="请输入"></el-input>
      </div>
      <div class="lab">倍公益积分</div>
      <div class="tig">（包括在线捐款、捐物，官方渠道捐款、捐物价值兑换公益积分的比例，默认1:1.2）</div>
    </div>

    <div class="itemCls">
      <div class="lab">服务积分兑换比例：</div>
      <div>
        <el-input style="width:200px" v-model="form.service_points_exchange_ratio" placeholder="请输入"></el-input>
      </div>
      <div class="lab">倍公益积分或提现现金</div>
      <div class="tig">(默认1:1)</div>
    </div>

    <div class="itemCls">
      <div class="lab">爱心值兑换比例：</div>
      <div>
        <el-input style="width:200px" v-model="form.love_value" placeholder="请输入"></el-input>
      </div>
      <div class="lab">爱心值 兑</div>
      <div>
        <el-input style="width:200px" v-model="form.public_welfare_integral" placeholder="请输入"></el-input>
      </div>
      <div class="lab">公益积分</div>
      <div class="tig">(默认5:1)</div>
    </div>

    <div class="itemCls">
      <div class="lab">公益积分使用比例：</div>
      <div>
        <el-input style="width:200px" v-model="form.integral_use_ratio" placeholder="请输入"></el-input>
      </div>
      <div class="lab">%</div>
      <div class="tig">（即订单支付时，最多可使用公益积分的比例）</div>
    </div>

    <el-button type="primary" :loading="btnLoading" @click="submit">保 存</el-button>
  </div>
</template>

<script>
import pointsConfigApi from '@/api/pointsConfigApi.js'
export default {
  data() {
    return {
      form: {},
      btnLoading:false
    }
  },
  created() {
    this.getDetails()
  },
  methods: {
    getDetails() {
      pointsConfigApi.donationConfigInfo().then(res => {
        if (res && res.data.code == 200) {
          this.form = res.data.data
        }
      })
    },
    // 提交
    submit() {
      if (!this.form.donation_exchange_ratio) {
        this.$message.error('请输入捐赠兑换比例');
        return
      } else if (!this.form.service_points_exchange_ratio) {
        this.$message.error('请输入服务积分兑换比例');
        return
      } else if (!this.form.love_value) {
        this.$message.error('请输入完成爱心值兑换比例');
        return
      } else if (!this.form.public_welfare_integral) {
        this.$message.error('请输入完成爱心值兑换比例');
        return
      } else if (!this.form.integral_use_ratio) {
        this.$message.error('请输入公益积分使用比例');
        return
      }
      this.btnLoading = true;
      pointsConfigApi.donationConfigAdd(this.form).then(res => {
        this.btnLoading = false;
        if (res && res.data.code == 200) {
          this.$message.success('保存成功！')
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.itemCls {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
  > div {
    margin: 0 5px;
  }
  > .tig {
    color: #6d6d6d;
  }
}
</style>